<template>
  <div class="list_tab_container clearfix">
    <div class="list_tab_main">
      <slot></slot>
    </div>
  </div>
</template>
<script>
export default {
  name: 'list_tab',
  props: {
    value: {
      type: Number,
      default: null
    }
  },
  computed: {
    currentIndex: {
      get () {
        return this.value
      },
      set (val) {
        this.$emit('input', val)
        this.$emit('change', val)
      }
    }
  },
  methods: {
    changeIndex (index) {
      this.currentIndex = index
    }
  }
}
</script>
<style lang="less" scoped>
.list_tab_container
{
  border-bottom: 1px solid #e4e7ed;
  padding: 20px 0 0;
  position: relative;
  margin: 0 0 15px;
  .list_tab_main
  {
    position: relative;
    float: left;
    z-index: 2;
    border: 1px solid #e4e7ed;
    border-bottom: none;
    border-radius: 4px 4px 0 0;
    box-sizing: border-box;
    margin-bottom: -1px;
  }
}
</style>
